/**
 * Created by yoyoyk on 2017/3/20.
 */
import React , {Component}from 'react';
import { Modal} from 'fly';
import InputBox from '../../../common/InputBox.js'
import  Confirm from '../../../common/Confirm.js'
import UpdatePasswordMutation from "./mutation/UpdatePasswordMutation"
import Relay from "react-relay";

import {_message} from 'ANT_DE';
const message = _message;

export default class MycenterModal extends React.Component {
    constructor(props){
        super(props);
        this.state = {
            visible: false,
            __pwd1:'',
            __pwd2:'',
            __pwd3:'',
        }
        this.Style={};

        this.i=0;
        this.j=0;
        this.k=0;

        this.clear = this.clear.bind(this);
    }

    componentWillMount() {
        this.Style.addstaffview={
            textAlign:"center",
            display:"block",
            border:"3px solid green"
        }
        this.Style.addstaffview.border = "3px solid red";
        this.Style.addstaffview.width = 400;
        this.Style.addstaffview.height = 200;
        this.Style.addstaffview.fontSize = 30;


        // this.Style.modalview={
        //     width:"634px",
        //     height:"565px",
        //     padding:"0px",
        //
        // }



        this.Style.headerview={
            width:"634px",
            height:"44px",
            paddingLeft:"18px",
            lineHeight:"44px",
            display:"block",
            background:"#ccc",
            marginBottom:49
        }
    }

    state = { visible: false }
    showModal = () => {
        this.setState({
            visible: true,
        });
    }
    handleOk = (e) => { 
        this.setState({
            visible: false,
        });
    }

    handleCancel = (e) => {
        this.setState({
            visible: false,
        });
    }


    handleClick(){
        //console.warn(111)
    }

    // modify(){
    //     //console.warn(this.refs.phone.state.text);
    //     // console.warn(this.refs.workername.state.text)
    //
    //     let telephone1 = this.refs._telephone.state.text;
    //     let re_telephone =/^(((13[0-9]{1})|(17[0-9]{1})|(15[0-9]{1})|(18[0-9]{1}))+\d{8})$/;
    //
    //     if(re_telephone.test(telephone1)){
    //         this.j = 1;
    //     }else {
    //         this.j = 0;
    //     }
    //     console.warn(this.props.phone);
    //
    //     if(j==1){
    //
    //
    //     }
    //
    //
    // }




    bluron(type){
        switch (type){
            case 'pwd2':
                let bb = this.refs._pwd2.state.text;
                let re_pwd2 = /^[0-9a-zA-Z]{6,12}$/
                if(re_pwd2.test(bb)){
                    this.setState({
                        __pwd2:"",
                    });
                    return true;
                }else {
                    this.setState({
                        __pwd2:"密码格式错误"
                    });
                    return false;
                }

            case 'pwd3':
                let cc = this.refs._pwd2.state.text;
                let dd = this.refs._pwd3.state.text;
                if(cc===dd){
                    this.setState({
                        __pwd3:""
                    });
                    return true;
                }else{
                    this.setState({
                        __pwd3:"两次密码输入不一致"
                    });
                    return false;
                }
        }
    }

    modify(){

        if( !(this.bluron("pwd2") &&  this.bluron("pwd3")) === true ){
            message.warning("请检查您当前输入的密码");
            return;
        }


        //格式确认无误发送数据
        Relay.Store.commitUpdate(
            new UpdatePasswordMutation({
                phone:this.props.phone,
                password:this.refs._pwd1.state.text,
                newPassword:this.refs._pwd2.state.text,
            }),
            {
                onFailure: () => {

                },
                onSuccess: (response) => {
                    const data = response.updatePassword.updatePassword;
                    if(data.errorCode === "0"){
                        message.success("编辑成功");
                        this.setState({
                            visible: false,
                        });
                    }else if(data.errorCode === "000003"){
                       message.error("账号密码错误");
                    }else if(data.errorCode === "000002"){
                        message.error("新旧密码不可冲突");
                    } else{
                        message.error("修改失败");
                    }
                }
            }
        );
    }
    clear(){
        this.refs._pwd1.setState({
            text:""
        });
        this.refs._pwd2.setState({
            text:""
        });
        this.refs._pwd3.setState({
            text:""
        })

        this.setState({
            __pwd1:'',
            __pwd2:'',
            __pwd3:'',
        })
    }
    render(){
        return (
                <Modal visible={this.state.visible}
                  className="mycenter_edit--info close_style_modal"
                  onOk={this.modify.bind(this)}
                  onCancel={this.handleCancel}
                  style={{width:"680",height:"565px",display:"block"}}
                  title={"编辑员工信息"}
                  >
                    <div className="mycenter_repas--modal___item">
                        <InputBox titletext="当前密码" type={"password"} className={"myCenter_info--input"}  space="20px" style={{width:312,height:30,borderColor:"#efefef",paddingLeft:10,color:"#999",paddingRight:64,marginTop:"10px"}} ref={'_pwd1'} />
                        <p className="mycenter_newPas--alarm">{this.state.__pwd1}</p>
                    </div>
                    <div  className="mycenter_repas--modal___item">
                        <InputBox titletext="新密码" type={"password"}  className={"myCenter_info--input"} space="20px" style={{width:312,height:30,borderColor:"#efefef",paddingLeft:10,color:"#999",paddingRight:64,marginTop:"10px"}} ref={'_pwd2'} bluron={this.bluron.bind(this,'pwd2')} />
                        <p className="mycenter_newPas--alarm">{this.state.__pwd2}</p>
                    </div>
                    <div  className="mycenter_repas--modal___item">
                        <InputBox titletext="确认新密码" type={"password"}  className={"myCenter_info--input"}  space="20px"
                                  style={{width:312,height:30,borderColor:"#efefef",paddingLeft:10,color:"#999",paddingRight:64,marginTop:"10px"}} ref={'_pwd3'} bluron={this.bluron.bind(this,'pwd3')}/>
                        <p className="mycenter_newPas--alarm">{this.state.__pwd3}</p>
                    </div>
                </Modal>
        )
    }
}
